<template>
  <base-modal
    :show.sync="show"
    :title="$t('common.base.editPermission')"
    width="800px"
    class="editpermiss-dialog"
    @closed="close"
  >
    <div class="base-modal-content" v-if="tableData.length > 0">
      <el-table
        ref="multipleTable"
        :data="tableData"
        style="width: 100%"
        class="page-table"
        :class="productLineIncludeBscAndCsc ? 'displayBlock' : ''"
        :highlight-current-row="false"
        header-row-class-name="page-table-header"
        stripe
        row-key="id"
        tooltip-effect="dark"
      >
        <el-table-column prop="name" :label="$t('common.base.roleName')"></el-table-column>
        <el-table-column prop="canRead" :label="$t('common.base.view')">
          <template slot-scope="scope">
            <el-checkbox v-model="scope.row.canRead" @change="checkAll(scope.row, 'canRead')"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column prop="canCreate" :label="$t('common.base.add')">
          <template slot-scope="scope">
            <el-checkbox v-model="scope.row.canCreate" @change="checkAll(scope.row, 'canCreate')"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column prop="canWrite" :label="$t('common.base.edit')">
          <template slot-scope="scope">
            <el-checkbox v-model="scope.row.canWrite" @change="checkAll(scope.row, 'canWrite')"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column prop="canDelete" :label="$t('common.base.delete')">
          <template slot-scope="scope">
            <el-checkbox v-model="scope.row.canDelete" @change="checkAll(scope.row, 'canDelete')"></el-checkbox>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="close">{{$t('common.base.cancel')}}</el-button>
      <el-button type="primary" @click="submit">{{$t('common.base.confirm')}}</el-button>
    </div>
  </base-modal>
</template>

<script>
/* util */
import { productLineIncludeBscAndCsc } from '@src/util/version.ts';
import { SHBProductLineEnum } from "@shb-lib/tenant";
import { cloneDeep } from 'lodash';
import i18n from '@src/locales'

export default {
  name: 'edit-premiss-dialog',
  props: {
    eventCard: {
      type: Object,
      default: () => ({}),
    },
    visiable: {
      type: Boolean,
      default: false,
    },
    roleList: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      tableData: [],
      show: false,
      allRoles: {
        canCreate: true,
        canDelete: true,
        canRead: true,
        canWrite: true,
        id: 'all',
        name: i18n.t('common.base.all'),
      },
    };
  },
  computed: {
    // 是否包含两条产品线
    productLineIncludeBscAndCsc() {
      return productLineIncludeBscAndCsc()
    },
  },
  methods: {
    // 角色权限全选
    checkAll(row, type) {
      if (row.id == 'all') {
        this.tableData.forEach(item => (item[type] = row[type]));
      } else if (row.id == 'bscAll') {
        this.tableData[0].children.forEach(item => (item[type] = row[type]))
      } else if (row.id == 'cscAll') {
        this.tableData[1].children.forEach(item => (item[type] = row[type]))
      } else {
        if (this.productLineIncludeBscAndCsc) {
          if (this.tableData[0].children.some(item => !item[type])) {
            this.tableData[0][type] = false
          }
          if (this.tableData[0].children.every(item => item[type])) {
            this.tableData[0][type] = true
          }
          if (this.tableData[1].children.some(item => !item[type])) {
            this.tableData[1][type] = false
          }
          if (this.tableData[1].children.every(item => item[type])) {
            this.tableData[1][type] = true
          }
        } else {
          if (this.tableData.some(item => !item[type] && item.id != 'all')) {
            this.tableData.forEach(item => {
              if (item.id == 'all') {
                item[type] = false;
              }
            });
          } else {
            this.tableData.forEach(item => {
              if (item.id == 'all') {
                item[type] = true;
              }
            });
          }
        }
      }
    },
    /* 保存 */
    submit() {
      let authJson = this.tableData.filter(item => item.id !== 'all');
      if (this.productLineIncludeBscAndCsc) {
        let bscAuthJson = this.tableData[0].children
        let cscAuthJson = this.tableData[1].children
        authJson = [...bscAuthJson, ...cscAuthJson]
      }
      this.$set(this.eventCard, 'authInfo', authJson);
      this.close();
    },
    /* 关闭 */
    close() {
      this.allRoles = this.$options.data().allRoles;
      this.$emit('update:visiable', false);
    },
    // 初始化角色数据
    rolesList() {
      let rolesList = this.mergeRoles();
      // 两条产品线数据处理
      if (this.productLineIncludeBscAndCsc) {
        let bscAndCscRolesList = [{
          id: 'bscAll',
          name: i18n.t('common.version.ServiceCloud'),
          children: [],
        }, {
          id: 'cscAll',
          name: i18n.t('common.version.CustomerServiceCloud'),
          children: [],
        }]
        rolesList.forEach((item, index) => {
          item.canCreate = item.canCreate == undefined ? item.canWrite : item.canCreate;
          item.canDelete = item.canDelete == undefined ? item.canWrite : item.canDelete;
          if (item.productLine == SHBProductLineEnum.BusinessServiceCloud) {
            bscAndCscRolesList[0].canRead = item.canRead
            bscAndCscRolesList[0].canWrite = item.canWrite
            bscAndCscRolesList[0].canCreate = item.canCreate
            bscAndCscRolesList[0].canDelete = item.canDelete
            bscAndCscRolesList[0].children.push(item)
          }
          if (item.productLine == SHBProductLineEnum.CustomerServiceCloud) {
            bscAndCscRolesList[1].canRead = item.canRead
            bscAndCscRolesList[1].canWrite = item.canWrite
            bscAndCscRolesList[1].canCreate = item.canCreate
            bscAndCscRolesList[1].canDelete = item.canDelete
            bscAndCscRolesList[1].children.push(item)
          }
        });
        console.log(bscAndCscRolesList, 'bscAndCscRolesList')
        return bscAndCscRolesList;
      }
      rolesList.forEach((item, index) => {
        item.canCreate = item.canCreate == undefined ? item.canWrite : item.canCreate;
        item.canDelete = item.canDelete == undefined ? item.canWrite : item.canDelete;
        if (!item.canRead) {
          this.allRoles.canRead = false;
        }
        if (!item.canWrite) {
          this.allRoles.canWrite = false;
        }
        if (!item.canCreate) {
          this.allRoles.canCreate = false;
        }
        if (!item.canDelete) {
          this.allRoles.canDelete = false;
        }
      });
      return [this.allRoles, ...rolesList];
    },
    // 合并权限数据
    mergeRoles() {
      let oldroles = cloneDeep(this.eventCard.authInfo);
      let newRoles = [];
      for (let i = 0; i < this.roleList.length; i++) {
        let role = this.roleList[i];

        let index = -1;
        for (let j = 0; j < oldroles.length; j++) {
          if (role.id == oldroles[j].id) {
            index = j;
            oldroles[j].name = role.name;
            oldroles[j].productLine = role.productLine;
            newRoles.push(oldroles[j]);
            break;
          }
        }
        if (index < 0) {
          // 存在不同相同数据 则追加
          let obj = {
            canCreate: false,
            canDelete: false,
            canRead: false,
            canWrite: false,
            id: role.id,
            name: role.name,
            productLine: role.productLine,
          };
          newRoles.push(obj);
        }
      }
      return newRoles;
    },
  },
  watch: {
    visiable(newValue) {
      this.show = newValue;

      if (newValue) {
        this.tableData = this.rolesList();
      }
    },
  },
};
</script>

<style lang="scss">
.editpermiss-dialog {
  .base-modal-body {
    padding: 20px 10px;
  }
  .displayBlock {
    .cell {
      display: block !important;
    }
  }
}
</style>
